﻿
@using ERP.Workflow.Designer.BlazorUI.Models
@using Blazor.Diagrams.Components.Renderers
@using AntDesign
@inject ToolBoxProvider ToolBoxProvider

<div  @ondblclick="(e)=>DbClick(e)"    class="default-node @(Node.Group != null ? "grouped" : "") @(Node.Selected ? "selected" : "")">
  
    @if (Node is not null&&Node.Icon is not null )
    {
          <Icon Type="@Node!.Icon" Rotate="@Node!.Rotate" Theme="outline"/>
    }
    
    @if (Node!.Contenteditable)
    {   
        <input @ref="InputRef" autofocus   value="@Node.Title" @onblur="Blur"  @onchange="Change" />
    }
    else
    {
           @(Node.Title ?? "步骤名称")
    }

    @foreach (var port in Node.Ports.Cast<FlowPortModel>())
    {
        <PortRenderer Port="port" Class="default" ></PortRenderer>
    }
</div>

@code {
    protected  ElementReference InputRef;

    [Parameter]
    public FlowNode? Node { get; set; }
    [CascadingParameter]
    public Diagram? Diagram{ get; set; }

    private List<ToolBoxItem>? tools = null;
    private ToolBoxItem? ToolBoxItem;
    protected override Task OnInitializedAsync()
    {
        tools = ToolBoxProvider?.Define();
        GetToolBoxItem();
        return base.OnInitializedAsync();
    }

    protected  void GetToolBoxItem()
    {
           ToolBoxItem = tools!.FirstOrDefault(m => m.Name == Node?.NodeType.ToString());
    }

    protected void DbClick(MouseEventArgs e)
    {
        Node!.Contenteditable = true;
        Task.Run(() =>
        {
            Task.Delay(100);
            InputRef.FocusAsync();
        });


    }
    void Change(ChangeEventArgs e)
    {
        Node!.Title = e!.Value + "";
    }
    protected void Blur(FocusEventArgs e)
    {
        Node!.Contenteditable = false;
        StateHasChanged();
    }


}

